﻿<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>管理后台</title> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="renderer" content="webkit"> <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"> <link href="/sitefiles/assets/images/favicon.png" rel="icon" type="image/png"> <link href="/sitefiles/assets/css/font-awesome-4.7.0.min.css?v=1604819048476" rel="stylesheet" type="text/css"> <link href="/sitefiles/assets/css/ionicons-2.0.0.min.css?v=1604819048476" rel="stylesheet" type="text/css"> <link href="/sitefiles/assets/lib/elementui/themechalk/index.css?v=1604819048476" rel="stylesheet" type="text/css"> <link href="/sitefiles/assets/css/element-ui.css?v=1604819048476" rel="stylesheet" type="text/css"> <style> .avatar-uploader .el-upload {
      width: 180px;
      border-radius: 6px;
      cursor: pointer;
      position: relative;
      overflow: hidden;
    }
    .avatar-uploader .el-upload:hover {
      border-color: #409EFF;
    }
    .avatar-uploader-icon {
      font-size: 28px;
      color: #8c939d;
      width: 178px;
      height: 178px;
      line-height: 178px;
      text-align: center;
    }
    .avatar {
      width: 178px;
      height: 178px;
      display: block;
    } </style> </head> <body> <div id="main"> <div v-if="this.pageLoad" style="display: none" :style="{display: ''}"> <div style="height: 10px"></div> <el-form size="small" ref="form" :model="form" label-width="280px"> <el-form-item label="是否启用水印功能"> <el-radio-group v-model="form.isWaterMark"> <el-radio :label="true">启用</el-radio> <el-radio :label="false">禁用</el-radio> </el-radio-group> </el-form-item> <el-form-item v-if="form.isWaterMark" label="添加水印位置"> <table width="300" height="243" border="0" background="/sitefiles/assets/images/waterMark.jpg"> <tbody> <tr> <td width="33%" align="center"> <el-radio v-model="form.waterMarkPosition" :label="1">1</el-radio> </td> <td width="33%" align="center"> <el-radio v-model="form.waterMarkPosition" :label="2">2</el-radio> </td> <td width="33%" align="center"> <el-radio v-model="form.waterMarkPosition" :label="3">3</el-radio> </td> </tr> <tr> <td width="33%" align="center"> <el-radio v-model="form.waterMarkPosition" :label="4">4</el-radio> </td> <td width="33%" align="center"> <el-radio v-model="form.waterMarkPosition" :label="5">5</el-radio> </td> <td width="33%" align="center"> <el-radio v-model="form.waterMarkPosition" :label="6">6</el-radio> </td> </tr> <tr> <td width="33%" align="center"> <el-radio v-model="form.waterMarkPosition" :label="7">7</el-radio> </td> <td width="33%" align="center"> <el-radio v-model="form.waterMarkPosition" :label="8">8</el-radio> </td> <td width="33%" align="center"> <el-radio v-model="form.waterMarkPosition" :label="9">9</el-radio> </td> </tr> </tbody> </table> <div class="tips">请在此选择水印添加的位置(共 9 个位置可选)</div> </el-form-item> <el-form-item v-if="form.isWaterMark" label="水印不透明度"> <el-select v-model="form.waterMarkTransparency"> <el-option v-for="waterMarkTransparency in [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]" :key="waterMarkTransparency" :value="waterMarkTransparency" :label="waterMarkTransparency + '0%'"></el-option> </el-select> <div class="tips">取值范围10%--100% (100%为不透明)</div> </el-form-item> <el-form-item v-if="form.isWaterMark" label="图片最小宽度" prop="waterMarkMinWidth" :rules="[
    { required: true, message: '请输入图片最小宽度' },
    { validator: utils.validateInt }
  ]"> <el-input v-model.number="form.waterMarkMinWidth" placeholder="请输入图片最小宽度"></el-input> <div class="tips">需要添加水印的图片的最小宽度，单位为像素，（0代表不限制）</div> </el-form-item> <el-form-item v-if="form.isWaterMark" label="图片最小高度" prop="waterMarkMinHeight" :rules="[
    { required: true, message: '请输入图片最小高度' },
    { validator: utils.validateInt }
  ]"> <el-input v-model.number="form.waterMarkMinHeight" placeholder="请输入图片最小高度"></el-input> <div class="tips">需要添加水印的图片的最小高度，单位为像素，（0代表不限制）</div> </el-form-item> <el-form-item v-if="form.isWaterMark" label="水印类型"> <el-radio-group v-model="form.isImageWaterMark"> <el-radio :label="false">文字水印</el-radio> <el-radio :label="true">图片水印</el-radio> </el-radio-group> </el-form-item> <el-form-item v-if="form.isWaterMark && !form.isImageWaterMark" label="文字水印内容" prop="waterMarkFormatString" :rules="{ required: true, message: '请输入文字水印内容' }"> <el-input v-model="form.waterMarkFormatString" placeholder="请输入文字水印内容"></el-input> <div class="tips">可以使用替换变量: {0}表示当前日期 {1}表示当前时间 例如:"上传于{0} {1}"</div> </el-form-item> <el-form-item v-if="form.isWaterMark && !form.isImageWaterMark" label="文字水印字体" prop="waterMarkFontName" :rules="{ required: true, message: '请选择文字水印字体' }"> <el-select v-model="form.waterMarkFontName" placeholder="请选择文字水印字体"> <el-option v-for="name in families" :key="name" :value="name" :label="name"></el-option> </el-select> </el-form-item> <el-form-item v-if="form.isWaterMark && !form.isImageWaterMark" label="文字水印文字大小（像素）" prop="waterMarkFontSize" :rules="[
    { required: true, message: '请输入文字水印文字大小' },
    { validator: utils.validateInt }
  ]"> <el-input v-model.number="form.waterMarkFontSize" placeholder="请输入文字水印文字大小"></el-input> </el-form-item> <el-form-item v-if="form.isWaterMark && form.isImageWaterMark" label="图片水印文件" prop="waterMarkImagePath" :rules="{ required: true, message: '请上传图片水印文件' }"> <el-upload class="avatar-uploader" :action="urlUpload" :headers="{Authorization: 'Bearer ' + $token}" :show-file-list="false" :drag="true" :limit="1" :before-upload="uploadBefore" :on-progress="uploadProgress" :on-success="uploadSuccess" :on-error="uploadError" :multiple="false"> <img v-if="imageUrl" :src="imageUrl" class="avatar"> <i v-else class="el-icon-plus avatar-uploader-icon"></i> </el-upload> </el-form-item> <el-form-item> <el-button type="primary" v-on:click="btnSubmitClick" size="small">确 定</el-button> </el-form-item> </el-form> </div> <div v-else :style="{top: ($(window).height()/2 - 30) + 'px'}" v-loading="true" element-loading-text="页面加载中"></div> </div> </body> </html> <script src="/sitefiles/assets/lib/es6-promise.auto.min.js?v=1604819048476" type="text/javascript"></script> <script src="/sitefiles/assets/lib/axios-0.17.1.min.js?v=1604819048476" type="text/javascript"></script> <script src="/sitefiles/assets/lib/core-js-3.6.5.min.js?v=1604819048476" type="text/javascript"></script> <script src="/sitefiles/assets/lib/lodash-4.17.10.min.js?v=1604819048476" type="text/javascript"></script> <script src="/sitefiles/assets/lib/jquery-1.9.1.min.js?v=1604819048476" type="text/javascript"></script> <script src="/sitefiles/assets/lib/layer/layer-3.1.1.js?v=1604819048476" type="text/javascript"></script> <script src="/sitefiles/assets/lib/sweetalert2-7.28.4.all.min.js?v=1604819048476" type="text/javascript"></script> <script src="/sitefiles/assets/lib/vue-2.5.16.min.js?v=1604819048476" type="text/javascript"></script> <script src="/sitefiles/assets/lib/elementui/index.js?v=1604819048476"></script> <script src="/sitefiles/assets/js/admin.js?v=1604819048476" type="text/javascript"></script> <script src="/sitefiles/assets/js/utils.js?v=1604819048476" type="text/javascript"></script> <script src="/sitefiles/assets/js/cloud.js?v=1604819048476" type="text/javascript"></script> <script src="/sitefiles/assets/js/admin/cms/settingsWaterMark.js?v=1604819048476" type="text/javascript"></script> 